<template>
    <div>
        <el-card shadow="never" v-if="!isVew && showView != 1 ">
            <div class="edu-page-title">
                <h2>导师申请列表</h2>
            </div>
            <hr>
            <div align="center">您目前还没有开放选导师权限</div>
        </el-card>
        <div class="edu-page-warp" v-else>
            <condition-card
                :showResetBtn="true"
                @search="searchList"
                @reset="reset"
                label-width="100px"
            >
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="姓名">
                            <el-input v-model="queryParams.condition" @keyup.enter.native="searchList"></el-input>
                            <input id="hiddenText" type="text" style="display:none" />
                        </el-form-item>
                    </el-col>
                </el-row>
            </condition-card>
            <el-card shadow="never">
                <div class="edu-page-title">{{titleTop}}</div>
                <edu-table
                    ref="mainTable"
                    url="/api/welcomeservice/tutorList/stu/list"
                    :order="false"
                    :selection="false"
                    @expandChange="expandChange"
                >
                    <el-table-column type="expand" width="50">
                        <template slot-scope="props">
                            <el-form
                                label-position="right"
                                inline
                                class="edu-row-expand-4"
                                label-width="120px"
                                label-suffix=":"
                            >
                                <el-row>
                                    <el-col :span="4">
                                        <div align="center" class="avatar-uploader">
                                            <img :src="props.row.face" class="avatar">
                                        </div>
                                    </el-col>
                                    <el-col :span="20">
                                        <el-row>
                                            <!--  <el-col :span="8">
                                <el-form-item label="工号" prop="teacherCode">
                                    <span>{{props.row.teacherCode}}</span>
                                </el-form-item>
                                            </el-col>-->
                                            <el-col :span="8">
                                                <el-form-item label="姓名" prop="teacherName">
                                                    <span>{{props.row.teacherName}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="性别" prop="sex">
                                                    <span>{{props.row.sexI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="职称" prop="title">
                                                    <span>{{props.row.titleI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item
                                                    label="人事所属学院"
                                                    prop="personnelCollege"
                                                >
                                                    <span>{{props.row.personnelCollegeI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="导师所属学院" prop="faculty">
                                                    <span>{{props.row.facultyI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item
                                                    label="专业"
                                                    prop="major"
                                                    v-if="tutorType ==2"
                                                >
                                                    <span>{{props.row.majorI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item
                                                    label="学堂"
                                                    prop="school"
                                                    v-if="tutorType ==1"
                                                >
                                                    <span>{{props.row.school}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="状态" prop="status">
                                                    <span>{{props.row.status ==1 ? '有效':'无效'}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="聘用年度" prop="grade">
                                                    <span>{{transGrade(props.row.grade)}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="16">
                                                <el-form-item
                                                    label="所属类"
                                                    prop="major"
                                                    v-if="tutorType ==1"
                                                >
                                                    <span>{{props.row.majorI18n}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="24">
                                                <el-form-item label="导师简介" prop="introduce">
                                                    <span
                                                        style=" width:100%;word-break:break-all;"
                                                    >{{props.row.introduce}}</span>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="24">
                                                <el-form-item label="备注" prop="remark">
                                                    <span
                                                        style=" width:100%;word-break:break-all;"
                                                    >{{props.row.remark}}</span>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                    </el-col>
                                </el-row>
                            </el-form>
                        </template>
                    </el-table-column>
                    <!-- <el-table-column label="工号" prop="teacherCode"/> -->
                    <el-table-column label="姓名" prop="teacherName"/>
                    <el-table-column label="性别" prop="sexI18n"/>
                    <el-table-column label="职称" prop="titleI18n"/>
                    <el-table-column
                        label="学院"
                        prop="facultyI18n"
                        v-if="tutorType  == 2"
                        show-overflow-tooltip
                    />
                    <el-table-column
                        label="专业"
                        prop="majorI18n"
                        v-if="tutorType  == 2"
                        show-overflow-tooltip
                    />
                    <el-table-column
                        label="年级"
                        prop="tutorGrade"
                        v-if="tutorType  == 1"
                        show-overflow-tooltip
                    />
                    <el-table-column
                        label="学堂"
                        prop="school"
                        v-if="tutorType  == 1"
                        show-overflow-tooltip
                    />
                    <el-table-column
                        label="所属类"
                        prop="majorI18n"
                        v-if="tutorType == 1"
                        show-overflow-tooltip
                    />
                    <el-table-column label="计划人数" prop="planNum"/>
                    <el-table-column label="实际人数" prop="actNum"/>
                    <el-table-column
                        :label="$t('message.operating')"
                        fixed="right"
                        v-if="isShow== 1"
                    >
                        <template slot-scope="scope">
                            <el-button
                                type="text"
                                @click="applyTutor(scope.row)"
                                size="mini"
                                :disabled="!isButton"
                            >申请</el-button>
                        </template>
                    </el-table-column>
                </edu-table>
            </el-card>
        </div>
    </div>
</template>
<script>
import Calendars from "common/src/api/calendars";
import { queryDic } from "common/src/api/dictionary";
import APIs from "common/src/api/welcomeService/tutorList";
import CPIs from "common/src/api/welcomeService/tutorExportImport";
import UTILS from "common/src/utils/utils";
import mixin from 'common/src/mixins/index';
// 本科生导师申请
export default {
    name: "TutorApply",
    mixins: [mixin],
    props: ["tutorType", "isShow", "showView"],
    computed: {},
    mounted() {        
        this.getStuCanApply();
    },
    data() {
        return {
            defaultPhoto: "/static/images/icon_photo.png",
            queryParams: {
                condition: "",
                status: 1,
                type: "",
            },
            titleTop: "",
            isButton: true,
            isVew: true
        };
    },
    methods: {
        getStuCanApply() {
            this.titleTop = this.isShow == 0 ? "导师信息列表" : "导师申请列表";
            APIs.getStuMessage(this.tutorType).then(res => {
                if (res.code == 200) {
                    // if(this.tutorType==2){
                    //     this.queryParams.faculty=this.global.currentUser.faculty
                    // }
                    // this.queryParams.major = res.data.major;
                    // this.queryParams.tutorGrade = res.data.currentGrade;
                    this.isButton = res.data.isButton;
                    this.isVew = res.data.isVew;
                    this.searchList();
                }
            });
        },
        reset() {
            this.queryParams.condition = "";
            this.queryParams.type = this.tutorType;
            this.searchList();
        },
        expandChange(row, expandedRows) {
            if (row.photo) {
                //有地址
                if (row.hasImg == 1) {
                    APIs.findPicture(row.photo).then(res => {
                        if (res.code == 200 && res.data) {
                            row.face = res.data.base;
                            row.hasImg == 1
                                ? (row.hasImg = 0)
                                : (row.hasImg = 1);
                        }
                    });
                }
            } else {
                row.face = this.defaultPhoto;
            }
        },
        searchList() {
            if (this.isVew) {
                //显示申请和查询
                this.queryParams.type = this.tutorType;
                this.$refs.mainTable.search(this.queryParams);
            } else {
                if (this.showView == 1) {
                    //只显示查询
                    this.queryParams.type = this.tutorType;
                    this.$refs.mainTable.search(this.queryParams);
                }
            }
        },
        // applyTutor(data){
        //      this.$confirm("一经提交，无法更改，请慎重选择！", "系统提示", {
        //         distinguishCancelAndClose: false,
        //         confirmButtonText: this.$t("message.confirm"),
        //         cancelButtonText: this.$t("message.cancel")
        //     }).then(_ => {
        //       APIs.applyTutor(data.id,this.tutorType).then(res =>{
        //         if(res.code==200){
        //            this.$message({
        //               type: "success",
        //               message: '申请成功'
        //             });
        //           this.getStuCanApply();
        //         }
        //       })
        //     });
        // },
        applyTutor(data) {
            this.$confirm("一经提交，无法更改，请慎重选择！", "系统提示", {
                distinguishCancelAndClose: false,
                confirmButtonText: this.$t("message.confirm"),
                cancelButtonText: this.$t("message.cancel")
            }).then(_ => {
                let loading = this.$loading({
                    lock: true,
                    text: "Loading",
                    spinner: "el-icon-loading",
                    background: "rgba(255, 255, 255, .48)"
                });
                APIs.applyTutor(data.id, this.tutorType).then(res => {
                    if (res.code == 200) {
                        this.delayRequest(res.data.key, loading);
                    } else {
                        loading.close();
                    }
                    // if(res.code==200){
                    //    this.$message({
                    //       type: "success",
                    //       message: '申请成功'
                    //     });
                    //   this.getStuCanApply();
                    // }
                });
            });
        },
        //异步获取批量结果
        delayRequest(key, loading) {
            setTimeout(() => {
                CPIs.getImportStatus(key).then(res => {
                    // this.exportResult = res.data;
                    if (res.code == 200 && res.data.status) {
                        if (res.data.success) {
                            this.$message({
                                type: "success",
                                message: "申请成功"
                            });
                            loading.close();
                            this.getStuCanApply();
                        } else {
                            loading.close();
                            this.$message({
                                type: "error",
                                message: res.data.msg
                            });
                        }
                    } else {
                        loading.close();
                    }
                });
            }, 2000);
        },
        transGrade(data) {
            if (data) {
                return data + "-" + (data + 1) + "年度";
            } else {
                return "";
            }
        }
    }
};
</script>
<style lang="scss" >
.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.avatar-uploader .el-upload:hover {
    border-color: #409eff;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}
.avatar {
    width: 178px;
    height: 178px;
    display: block;
}
</style>

